$(function(){
	$.ajax({
		url: './xml/province.xml',
		dataType: 'xml',
		success: function(data) {
			$(data).find("fields").each(function() {
				var fields = $(this);
				var provinces = fields.find("province");
				for (var i = 0; i < provinces.length; i++) {
					var province = $(provinces[i]).text();
					var objNewOption = $('<option>', {
						'id': 'i',
						'name': 'pro',
						'value': $(provinces[i]).attr('name')
					});
					objNewOption.html(province);
					$('[name="province"]').append(objNewOption);
				};
			})
		}
	});
	//得到城市
	var provinceName;
	var provinceselected;
	$('[name="province"]').change(function() {
		$('[name="area"]').html('<option selected="true" value=""></option>');
		provinceselected = $(this).val();
		provinceName=$(this).find('option:selected').text();
		// console.log(provinceName);
		console.log(provinceselected);
		if (provinceName) {
			$.ajax({
				url: './xml/province/' + provinceselected + '.xml',
				dataType: 'xml',
				success: function(data) {
					$(data).find("fields").each(function() {
						var fields = $(this);
						var citys = $(fields).find('city');
						$('[name="city"]').html('<option selected="true" value=""></option>');
						for (var i = 0; i < citys.length; i++) {
							var city = $(citys[i]).text();
							var objNewOption = $('<option>', {
								'id': 'i',
								'value': city
							});
							objNewOption.html(city);
							$('[name="city"]').append(objNewOption);
						};
					})
				}
			})
		} else {
			$('[name="city"]').html('<option selected="true" value=""></option>');
		}
	});

	//得到地区
	var center;
	$('[name="city"]').change(function() {
		cityName = $(this).val();
		if (cityName) {
			$.ajax({
				url: './xml/city/' + provinceselected + '.xml',
				dataType: 'xml',
				success: function(data) {
					$(data).find("fields").each(function() {
						var fields = $(this);
						var city = fields.find('city[name=' + cityName + ']');
						center = {
							X: $(city).attr('centerX'),
							Y: $(city).attr('centerY')
						};
						console.log(center);
						var areas = $(city).find('area');
						$('[name="area"]').html('<option selected="true" value=""></option>');
						for (var i = 0; i < areas.length; i++) {
							var area = $(areas[i]).text();
							var objNewOption = $('<option>', {
								'id': 'i',
								'value': area
							});
							objNewOption.html(area);
							$('[name="area"]').append(objNewOption);
						};
					})
				}
			})
		} else {
			$('[name="area"]').html('<option selected="true" value=""></option>');
		}
	});
})